<template>
	<view>
		<nav-bar></nav-bar>
		<view class="" style="text-align: center;">
			<view class=" mb-3" style="font-size: 26px;font-weight: 500;color: #000000;line-height: 50px;letter-spacing: 2px;">聚园荟</view>
			<view style="height: 20px;font-size: 20px;font-family: PingFangHK-Regular, PingFangHK;font-weight: 400;color: #B7BAC0;line-height: 28px;">荟聚全国精英园区</view>
		</view>
		<view
			v-html="content"
			style="text-indent: 2em; padding: 0 30px; margin-top:30px;margin-bottom:30px;font-size: 14px;font-family: PingFangHK-Light, PingFangHK;font-weight: 300;color: #red;line-height: 30px;letter-spacing: 1px;"
		></view>
		<view class="" style=" padding: 0 30px;">
			<p style="margin-bottom:10px;height: 33px;font-size: 20px;font-family: PingFangHK-Regular, PingFangHK;font-weight: 400;color: #000000;line-height: 33px;">
				具体服务项目
			</p>
			<view class="" style="display: flex; align-items: center;flex-wrap: wrap;">
				<view class="" style="display: flex; align-items: center; margin:  10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_21.png" alt="" />
					<p style="font-size: 16rpx;">免费发布</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin:  10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_22.png" alt="" />
					<p style="font-size: 16rpx;">优惠服务</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin: 10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_23.png" alt="" />
					<p style="font-size: 16rpx;">园区交流</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin:  10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_24.png" alt="" />
					<p style="font-size: 16rpx;">园区学习</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin:  10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_25.png" alt="" />
					<p style="font-size: 16rpx;">园区联合</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin: 10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_26.png" alt="" />
					<p style="font-size: 16rpx;">园区托管</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin:  10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_27.png" alt="" />
					<p style="font-size: 16rpx;">园区兼并</p>
				</view>
				<view class="" style="display: flex; align-items: center;margin: 10px;">
					<img style="width: 20px;height: 20px; margin-right: 10px;" src="../../static/product_28.png" alt="" />
					<p style="font-size: 16rpx;">园区投资</p>
				</view>
			</view>

			<p style="margin-bottom:10px;height: 33px;font-size: 20px;font-family: PingFangHK-Regular, PingFangHK;font-weight: 400;color: #000000;line-height: 33px;">活动报道</p>
			<view
				class=""
				style="display: flex;justify-content: space-between; align-items: center;margin: 10px 0; "
				v-for="(item, index) in newsList"
				:key="index"
				@click="goToNewDetailView(item.id)"
			>
				<view class="newsnamess">{{ item.newsname }}</view>
				<view class="createTimess">{{ item.createTime }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			content: '',
			newsList: [],
			newsListQuery: {
				pageNum: 1,
				pageSize: 10,
				zixunleixing: 8
			}
		};
	},
	onLoad() {
		this.getcontent();
		this.fetchNewsList();
	},
	methods: {
		goToNewDetailView(id) {
			uni.navigateTo({
				// url: '/pages/gardengat/garinfo?id=' + id
				url: '/pages/news/detail?id=' + id
			});
		},
		getcontent() {
			// console.log(2222222222);
			let that = this;
			this.$apiCall.request(
				'get',
				`/fuwenben/${9}`,
				{},
				{
					sucCb(data) {
						that.content = data.data;

						console.log(this);
					}
				}
			);
		},
		fetchNewsList() {
			var that = this;
			this.$apiCall.request('post', '/news/list?zixunleixing=8', this.newsListQuery, {
				sucCb(data) {
					that.newsList = data.data;
				}
			});
			// this.$apiCall.request('post', '/news/list', this.newsListQuery, {
			// 	sucCb(data) {
			// 		that.newsList = data.data;
			// 	}
			// });
		}
	}
};
</script>

<style>
.newsnamess {
	/* border: 1px solid red; */
	color: rgb(254, 119, 67);
	width: 68%;
	overflow: hidden; //超出隐藏
	white-space: nowrap; //不折行
	text-overflow: ellipsis; //溢出显示省略号
}
.createTimess {
	/* border: 1px solid red; */
	width: 180rpx;
	color: rgb(254, 119, 67);
	overflow: hidden; //超出隐藏
	white-space: nowrap; //不折行
	/* text-overflow: ellipsis; //溢出显示省略号 */
}
</style>
